/**
 * Created by Adi(adi@imeth.cn) on 2018/8/29.
 */
import React from 'react';
import { Form, Row, Col, Input, Button, Icon } from 'antd';

const FormItem = Form.item;

@Form.create()
export default class ContentSearch extends React.Component {
  state = {
    shrink: true,
  };

  render() {
    const { form } = this.props;
    const { shrink } = this.state;
    const { getFieldDecorator } = form;
    return (
      <Form>
        <Row gutter={{ md: 8, lg: 24, xl: 48 }}>
          <Col md={8} sm={24}>
            <FormItem label="规则编号" style={{ display: 'flex' }}>
              {getFieldDecorator('no')(<Input placeholder="请输入" />)}
            </FormItem>
          </Col>
          <Col md={8} sm={24}>
            <FormItem label="规则编号" style={{ display: 'flex' }}>
              {getFieldDecorator('no')(<Input placeholder="请输入" />)}
            </FormItem>
          </Col>
          <Col md={8} sm={24}>
            <FormItem label="规则编号" style={{ display: 'flex' }}>
              {getFieldDecorator('no')(<Input placeholder="请输入" />)}
            </FormItem>
          </Col>
        </Row>
        <div style={{ overflow: 'hidden' }}>
          <div style={{ float: 'right', marginBottom: 24 }}>
            <Button type="primary" htmlType="submit" onClick={() => console.info('1')}>
              查询
            </Button>
            <Button style={{ marginLeft: 8 }} onClick={this.handleFormReset}>
              重置
            </Button>
            <a style={{ marginLeft: 8 }} onClick={() => this.setState({ shrink: !shrink })}>
              {shrink ? (
                <span>
                  展开 <Icon type="down" />
                </span>
              ) : (
                <span>
                  收起 <Icon type="up" />
                </span>
              )}
            </a>
          </div>
        </div>
      </Form>
    );
  }
}
